import { Button, Form, Modal } from 'antd';
import { CompanySelect } from 'comps/common';
import * as React from 'react';

const FormItem = Form.Item;

class AssignMachineForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      submiting: false
    };
  }

  doSubmit(evt) {
    evt.preventDefault();
    const { companyId } = this.props.form.getFieldsValue();
    return this.props.onSubmit(this.props.machineId, companyId);
  }

  render() {
    const { getFieldProps } = this.props.form;

    return (
      <Form inline onSubmit={::this.doSubmit}>
        <FormItem>
          <CompanySelect {...getFieldProps('companyId')} style={{ width: '200px' }}/>
        </FormItem>
        <Button type='primary' htmlType='submit'>匹配公司</Button>
      </Form>
    );
  }
}

AssignMachineForm = Form.create()(AssignMachineForm);

class AssignMachineModal extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      show: false
    };
  }

  onSubmit(machineId, companyId) {
    return this.props.onMachineAssign(machineId, companyId)
      .then(() => {
        ::this.close();
      });
  }

  close() {
    this.setState({ show: false });
  }

  show(machineId) {
    this.setState({ show: true, machineId });
  }

  render() {
    return (
      <Modal title='分配机器' visible={this.state.show} footer={undefined} onCancel={::this.close}>
        <AssignMachineForm machineId={this.state.machineId} onMachineAssign={this.props.onMachineAssign} onSubmit={::this.onSubmit}/>
      </Modal>
    );
  }
}

export default AssignMachineModal;
